<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>LifeInClass - School Control Panel</title>

    <!-- Bootstrap core CSS -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="css/navbar-static-top.css" rel="stylesheet">
   
    <link href="css/jquery.dataTables.css" rel="stylesheet">
    <link href="css/DT_bootstrap/DT_bootstrap.css" rel="stylesheet">
    <link href="css/panels.css" rel="stylesheet">
<!--     <link href="css/morris.css" rel="stylesheet">
 -->
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->

    <!-- Custom styles for this template -->
	
	<script src="js/jquery-1.11.1.min.js"></script>

    <link href="css/carousel.css" rel="stylesheet">
    <style type="text/css">
      .head-tabs{
        color:#fff;
        font-weight: bold;
      }
    </style>
  </head>

<script>

$(document).ready(function (){
	//check cookie
	var cookieValue=$.cookie("school");
	if(typeof(cookieValue)  === "undefined") 
	window.location.href = "index.html"
	
	//cookie values
	var cookieValue=$.cookie("school");
	var cookieValueArray = cookieValue.split('/');
	$("#logedSchool").append(cookieValueArray[1]);
	$("#logedUser").append("Welcome, "+cookieValueArray[2]);
});

</script>

<body style="padding-bottom:0;">

<!-- ============   Navigation-static-top navbar (HOME PAGE HEADER)  ============== -->


 <div class="row-fluid" style="padding:0% 8%; background: #a8cf45;">
  <div class="container" style="margin-left:4%">
    <a href="schoolcontrolpanel.html"><font size="7" color="grey" id="logedSchool"></font></a>
    <ul class="navbar-nav pull-right" style="margin-right:15%; margin-top:1%; list-style:none;">
          <li><font size="3" id="logedUser"></font></li>
    </ul>
    <ul class="navbar-nav pull-right" style="margin-right:-16%; margin-top:4%; list-style:none;">
          <li><a href="terms.html"><font size="2">ACCOUNT</a></font>&nbsp&nbsp&nbsp</li>
          <li><a href="#" id="schoolLogout" style="text-decoration:none"><font size="2">/  LOG OFF</a></font></li>
    </ul>
  </div>
</div>


<!-- ============    End of Navigation-static-top navbar (HOME PAGE HEADER)  ============== -->




<!-- ============================   Lower Header   ========================= -->

<nav class="navbar navbar-default navbar-static-top" role="navigation" style="background: #5F9EA0; margin-bottom:0%; padding:0% 12%;">
  <div class="row-fluid" style="padding:0% 4%;">
    <div class="row">
      <a href="schoolcontrolpanel.html"><img width="100px" height="100px" src="images/schoolimage.jpg" style="margin-right:20%; margin-top:0%;"></a>
      <div class="col-md-9 col-md-push-3">
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar" >
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
      </div>
      <div id="navbar" class="navbar-collapse collapse" style="margin-top:0%;">
        <ul class="nav navbar-nav" style="margin-left:12%; margin-bottom:0%; margin-top:-10.4%;">
          <li><a href="#home" class="head-tabs" data-toggle="tab"><font size="3">Home</font></a></li>
          <li><a href="#configuration" class="head-tabs" data-toggle="tab" onclick="return examConf();"><font size="3">Configuration</font></a></li>
          <li><a href="#teachers" class="head-tabs" data-toggle="tab" onclick="getTeachers();"><font size="3">Teachers</font></a></li>
          <li><a href="#students" class="head-tabs" data-toggle="tab" onclick="return students();"><font size="3">Students</font></a></li>
          <li><a href="#attendance" class="head-tabs" data-toggle="tab"><font size="3">Attendance</font></a></li>
          <li><a href="#complaints" class="head-tabs" data-toggle="tab" onclick="return complaints();"><font size="3">Complaints</font></a></li>
          <li><a href="#remarks" class="head-tabs" data-toggle="tab" onclick="return remarks();"><font size="3">Remarks</font></a></li>
          <li><a href="#results" class="head-tabs" data-toggle="tab"><font size="3">Results</font></a></li>
          <li><a href="#discipline" class="head-tabs" data-toggle="tab" onclick="return discipline();"><font size="3">Discipline</font></a></li>
          <li><a href="#achievements" class="head-tabs" data-toggle="tab" onclick="return achievements();"><font size="3">Achievments</font></a></li>
          <li><a href="#rankings" class="head-tabs" data-toggle="tab"><font size="3">Rankings</font></a></li>
          <li><a href="#parentportal" class="head-tabs" data-toggle="tab"><font size="3">Parent Portal</font></a></li>
          <li><a href="#parentmsg" class="head-tabs" data-toggle="tab"><font size="3">Parent Messaging</font></a></li>
          <li><a href="#extracurricular" class="head-tabs" data-toggle="tab" onclick="return extra();"><font size="3">Extra Curricular</font></a></li>
        </ul>
      </div>
    </div>
  </div>
</nav>

<!-- ========================   End Of Lower Header   ====================== -->



<!-- ==========================================  Tab Content  ====================================== -->

<div class="tab-content" style="margin-top: 1%">

<!-- Home  -->

<div role="tabpanel" class="tab-pane active" id="home">
  <div class="container" style="padding:0% 6%">

  <h1 style="color:lightblue">Home</h1>
  <i>School Control Panel</i>
  <hr width=100%  align=left>
  
  <div class="row">
                    <div class="col-lg-3 col-md-6">
                        <div class="panel panel-primary">
                            <div class="panel-heading">
                                <div class="row">
                                    <div>
                                      <h1><center>Instructions</center></h1>
                                    </div>
                                    <div class="col-xs-9 text-left">
                                      <div style="margin-left:37%;">How it works?</div>
                                    </div>
                                </div>
                            </div>
                            <a href="#">
                                <div class="panel-footer">
                                    <span class="pull-left"><a href="instruction.html">View Details</a></span>
                                </div>
                            </a>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-6">
                        <div class="panel panel-green">
                            <div class="panel-heading">
                                <div class="row">
                                    <div>
                                      <h1><center>Calendar</center></h1>
                                    </div>
                                    <div style="margin-left:23%;">
                                      <div> Academic calendar</div>
                                    </div>
                                </div>
                            </div>
                            <a href="#">
                                <div class="panel-footer">
                                  <a href="calendar.html">View Details</a>
                                </div>
                            </a>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-6">
                        <div class="panel panel-yellow">
                            <div class="panel-heading">
                                <div class="row">
                                    <div><h1><center>Time Table</center></h1></div>
                                    <div style="margin-left:20%;">Time tables of classes</div>
                                </div>
                            </div>
                            <a href="#">
                                <div class="panel-footer">
                                  <a href="timetable.html">View Details</a>
                                </div>
                            </a>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-6">
                        <div class="panel panel-red">
                            <div class="panel-heading">
                                <div class="row">
                                    <h1><center>Gallery</center></h1>
                                    <div class="col-xs-9 text-left">
                                        
                                        <div style="margin-left:35%;">School photos</div>
                                    </div>
                                </div>
                            </div>
                            <a href="#">
                                <div class="panel-footer">
                                  <a href="gallery.html">View Details</a>
                                </div>
                            </a>
                        </div>
                    </div>
                </div>
                <!-- /.row -->
      <div class="row" style="padding:0% 1%">
        <h1 style="color:lightblue">Upcoming Events</h1>
        <hr width=100%  align=left>
        <h4>Event Name :</h4>
        <input type="text" class="form-control" aria-label="..." style="width: 30%">
        <h4>Event Date :</h4>
        <input type="text" class="form-control" aria-label="..." style="width: 30%">
        <h4>Description:</h4>
        <textarea class="form-control" rows="3"></textarea><br/>
        <button class="btn btn-primary btn-sm" style="float: left;">Submit</button>
        <br/>
        <br/>
        <h1 style="color:lightpink">Upcoming Events</h1>
        <hr width=100%  align=left>
        <div class="table-responsive">
    <table class="table table-striped" id="tbl-complaints">
      <thead>
        <tr>
          <th><center>Sl No.</center></th>
          <th><center>Event Name</center></th>
          <th><center>Event Date</center></th>
          <th><center>Description</center></th>
          <th><center><center>Send Message or E-mail</center></th>
          <th><center>Date & Time</center></th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <th><center>1</center></th>
          <th><center>Annual Gathering</center></th>
          <th><center>15-feb-2015</center></th>
          <th><center>You are cordially invited.</center></th>
          <th><center><button class="btn btn-warning btn-xs"><span class="glyphicon glyphicon-comment"></span></button>&nbsp<button class="btn btn-warning btn-xs"><span class="glyphicon glyphicon-envelope"></span></button></center></th>
          <th><center>12.36pm, 1-feb-15</center></th>
        </tr>
        <tr>
          <th><center>2</center></th>
          <th><center>Annual Gathering</center></th>
          <th><center>15-feb-2015</center></th>
          <th><center>You are cordially invited.</center></th>
          <th><center><button class="btn btn-warning btn-xs"><span class="glyphicon glyphicon-comment"></span></button>&nbsp<button class="btn btn-warning btn-xs"><span class="glyphicon glyphicon-envelope"></span></button></center></th>
          <th><center>12.36pm, 1-feb-15</center></th>
        </tr>
      </tbody>
    </table>
    <br/>

      


  </div>
      </div>
  
  </div>      
</div>

<!-- End Home  -->

<!-- Configuration -->

<div role="tabpanel" class="tab-pane" style="margin-top: 1%" id="configuration">
  <div class="container" style="padding:0% 6%">

  <h1 style="color:lightblue">Configuration</h1>
  <i>Configure according to your school requirement. Total number of standards, divisions, subjects & tests in school.</i>
  <hr width=100%  align=left>
  <div class="well"> 
    <div class="row">
      <div class="col-md-4" style="padding: 0.8% 15px">
        Number of unit tests to be conducted anually
      </div>
      <div class="col-md-3">
        <input type="text" id="testExamConf" class="form-control" style="width: 65%;float: left;"> <button onclick="updateExamConf();" class="btn btn-primary btn-sm" style="float: right;margin-top: 1.1%">update</button>
      </div>
    </div>
    <div class="row">
      <div class="col-md-4" style="padding: 0.8% 15px">
        Number of main exams to be conducted anually
      </div>
      <div class="col-md-3">
        <input type="text" id="mainExamConf" class="form-control" style="width: 65%;float: left;"> <button onclick="updateExamConf();" class="btn btn-primary btn-sm" style="float: right;margin-top: 1.1%">update</button>
      </div>
    </div>
  </div>
  
	<div class="well">
  <div class="row">

    <div class="col-md-3" style="margin-right:10%">
      <h3 style="color:lightpink">Add Standard</h3>
      <p>---------------------------------------------</p>
      <div class="input-group">
        <div class="input-group-btn">
        <input id="standardName"type="text" class="form-control" aria-label="..." style="width: 80%">
         <button type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown" aria-expanded="false" onclick="addStandard();">Add</button>
        </div><!-- /btn-group -->
      </div>    
    </div>

    <div class="col-md-3" style="margin-right:10%">
      <h3 style="color:lightpink">Add Division</h3>
      <p>---------------------------------------------</p>
      <div class="btn-group" style="float: left">
        <button type="button" class="btn btn-info">Standard</button>
        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
          <span class="caret"></span>
          <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu" role="menu" id="student_adddivision_config"></ul>
      </div><br/><br/>
      <div class="input-group">
        <div class="input-group-btn">
        <input id="ExamDivision" type="text" class="form-control" aria-label="..." style="width: 80%">
        <button  type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown" aria-expanded="false" onclick="addDivision();">Add</button>
        </div><!-- /btn-group -->
      </div>
    </div>
    <div class="col-md-3">
      <h3 style="color:lightpink">Add Subjects</h3>
      <p>---------------------------------------------</p>
      <div class="btn-group" style="float: left">
        <button type="button" class="btn btn-info">Standard</button>
        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
          <span class="caret"></span>
          <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu" role="menu" id="student_addsubject_standard_configSubject"></ul>
      </div>
       <div class="btn-group" style="float: right">
        <button type="button" class="btn btn-info">Division</button>
        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
          <span class="caret"></span>
          <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu" role="menu" id="student_addsubject_division_configSubject"></ul>
      </div>

      <br/><br/>
		  <div class="col-md-16"  style="padding: 2px 0 1px 0">
			<input id="addSubjectName" type="text" class="form-control" aria-label="..." style="width: 80%" placeholder="Subject">
		  </div>
		  <div class="col-md-16"  style="padding: 2px 0 1px 0">
			<input id="addSubjectTestMax" type="text" class="form-control" aria-label="..." style="width: 80%" placeholder="Max test mark">
		  </div>
		  <div class="col-md-16"  style="padding: 2px 0 1px 0">
			<input id="addSubjectMainMax" type="text" class="form-control" aria-label="..." style="width: 80%" placeholder="Max main exam mark">
		  </div>
		  <div class="col-md-16"  style="padding: 5px 0 5px 0">
			<button onclick="addSubject();" type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown" aria-expanded="false">Add</button>
		  </div> 
    </div>
</div>
  </div><!-- Div row-->
  
  <br/>
  <div>
    <div class="table-responsive">
    <!--<table class="table table-striped">
      <thead>
        <tr>
          <th>Standards</th>
          <th>Divisions</th>
          <th>Subjects</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td>1</td>
          <td>
            <button class="btn btn-primary btn-xs">A <span class="glyphicon glyphicon-remove"></span></button> 
            <button class="btn btn-primary btn-xs">B <span class="glyphicon glyphicon-remove"></span></button>
            <button class="btn btn-primary btn-xs">C <span class="glyphicon glyphicon-remove"></span></button>
          </td>
          <td>
            <button class="btn btn-default btn-xs">Kannada <span class="glyphicon glyphicon-remove"></span></button>
            <button class="btn btn-default btn-xs">Hindi <span class="glyphicon glyphicon-remove"></span></button>
            <button class="btn btn-default btn-xs">English <span class="glyphicon glyphicon-remove"></span></button>
            <button class="btn btn-default btn-xs">Science <span class="glyphicon glyphicon-remove"></span></button>
            <button class="btn btn-default btn-xs">Mathematics <span class="glyphicon glyphicon-remove"></span></button>
            <button class="btn btn-default btn-xs">Social Science <span class="glyphicon glyphicon-remove"></span></button>
          </td>
        </tr> 
        <tr>
          <td>2</td>
          <td>
            <button class="btn btn-primary btn-xs">A <span class="glyphicon glyphicon-remove"></span></button> 
            <button class="btn btn-primary btn-xs">B <span class="glyphicon glyphicon-remove"></span></button></td>
          <td>
            <button class="btn btn-default btn-xs">Kannada <span class="glyphicon glyphicon-remove"></span></button>
            <button class="btn btn-default btn-xs">Hindi <span class="glyphicon glyphicon-remove"></span></button>
            <button class="btn btn-default btn-xs">English <span class="glyphicon glyphicon-remove"></span></button>
            <button class="btn btn-default btn-xs">Science <span class="glyphicon glyphicon-remove"></span></button>
            <button class="btn btn-default btn-xs">Mathematics <span class="glyphicon glyphicon-remove"></span></button>
            <button class="btn btn-default btn-xs">Social Science <span class="glyphicon glyphicon-remove"></span></button>
          </td>
        </tr> 
        <tr>
          <td>3</td>
          <td>
            <button class="btn btn-primary btn-xs">A <span class="glyphicon glyphicon-remove"></span></button> 
            <button class="btn btn-primary btn-xs">B <span class="glyphicon glyphicon-remove"></span></button>
          </td>
          <td>
            <button class="btn btn-default btn-xs">Kannada <span class="glyphicon glyphicon-remove"></span></button>
            <button class="btn btn-default btn-xs">Hindi <span class="glyphicon glyphicon-remove"></span></button>
            <button class="btn btn-default btn-xs">English <span class="glyphicon glyphicon-remove"></span></button>
            <button class="btn btn-default btn-xs">Science <span class="glyphicon glyphicon-remove"></span></button>
            <button class="btn btn-default btn-xs">Mathematics <span class="glyphicon glyphicon-remove"></span></button>
            <button class="btn btn-default btn-xs">Social Science <span class="glyphicon glyphicon-remove"></span></button>
          </td>
        </tr> 
        <tr>
          <td>4</td>
          <td>
            <button class="btn btn-primary btn-xs">A <span class="glyphicon glyphicon-remove"></span></button> 
            <button class="btn btn-primary btn-xs">B <span class="glyphicon glyphicon-remove"></span></button>
          </td>
          <td>
            <button class="btn btn-default btn-xs">Kannada <span class="glyphicon glyphicon-remove"></span></button>
            <button class="btn btn-default btn-xs">Hindi <span class="glyphicon glyphicon-remove"></span></button>
            <button class="btn btn-default btn-xs">English <span class="glyphicon glyphicon-remove"></span></button>
            <button class="btn btn-default btn-xs">Science <span class="glyphicon glyphicon-remove"></span></button>
            <button class="btn btn-default btn-xs">Mathematics <span class="glyphicon glyphicon-remove"></span></button>
            <button class="btn btn-default btn-xs">Social Science <span class="glyphicon glyphicon-remove"></span></button>
          </td>
        </tr> 
      </tbody>
    </table> -->
  </div>
  <br/>
  </div>
  </div> 
</div>

<!-- End Configuration -->

<!-- Teachers -->

<div role="tabpanel" class="tab-pane" id="teachers">
  <div class="container" style="padding:0% 6%">

  <h1 style="color:lightblue">Teachers</h1>
  <i>List of teachers and their details.</i>
  <hr width=100%  align=left>
    <div style="max-width:100%">
    <div class="table-responsive">

      <table id="tbl-teachers" class="table table-striped">
        <thead>
          <tr>
			<th id="teacherId">Id</th>
            <th><center><input class="form-control" type="text" placeholder="Emp No" id="txtempno"></center></th>
            <th><center><input class="form-control" type="text" placeholder="Emp Name" id="txtTeacherName"></center><center></th>
            <th><center><input class="form-control" type="text" placeholder="Emp Gender" id="txtTeacherGender"></center></th>
            <th><center><input class="form-control" type="text" placeholder="Emp Position" id="txtTeacherPosition"></center></th>
            <th><center><center><center><center><input class="form-control" type="text" placeholder="Employment Date" id="txtTeacherDoj"></center></th>
            <th><center><center><center><button class="btn btn-primary" onclick="saveTeacher();"> Add </button></center></th>
          </tr>
        </thead>
        <tbody>

        </tbody>
      </table>
      <br/>
    </div>
    </div>
  </div> 
</div>

<!-- End Teachers -->

<!-- Students -->

<div role="tabpanel" class="tab-pane" style="margin-top: 1%" id="students">
  <div class="container" style="padding:0% 6%">

  <h1 style="color:lightblue">Students</h1>
  <i>Total number of students in school(standard & division wise).</i>
  <hr width=100%  align=left>
  <div class="btn-group" style="float: left">
                <button type="button" class="btn btn-info">Standard</button>&nbsp
                <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                  <span class="caret"></span>
                  <span class="sr-only">Toggle Dropdown</span>
                </button>
                <ul class="dropdown-menu" role="menu" id="student_standard"></ul>
    </div>
    <div class="btn-group" style="float: left">
                <button type="button" class="btn btn-info">Division</button>
                <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                  <span class="caret"></span>
                  <span class="sr-only">Toggle Dropdown</span>
                </button>
                <ul class="dropdown-menu" role="menu" id="student_division"></ul>
    </div>
    <br/><br/><br/>
    <div style="max-width:100%">
      <div class="table-responsive">

      <table id="tbl-student-students" class="table table-striped">
        <thead>
          <tr>
			<th id="studentId">Id</th>
            <th><center><input class="form-control" type="text" placeholder="Roll NO" id="studentRollno"></center></th>
            <th><center><input class="form-control" type="text" placeholder="Full Name" id="studentName"></center></th>
            <th><center><input class="form-control" type="text" placeholder="Gender" id="studentGender"></center></th>
            <th><center><input class="form-control" type="text" placeholder="Email" id="studentEmail"></center></th>
            <th><center><input class="form-control" type="text" placeholder="Phone" id="studentPhone"></center></th>
            <th><center>Invite</center></th>
            <th><center><button class="btn btn-primary" onclick="submitStudent();"> Add </button></center></th>
          </tr>
        </thead>
        <tbody>

        </tbody>
      </table>
      <br/>
    </div>

   </div> 
  </div> 
</div>

<!-- End Students -->

<!-- Attendance -->

<div role="tabpanel" class="tab-pane" id="attendance">
  <div class="container" style="padding:0% 6%">
  
  <h1 style="color:lightblue">Attendance</h1>
  <i>Total number of standards and divisions in school.</i>
  <hr width=100%  align=left>
  
  <div class="row">
    <div class="col-md-4">
      <div class="btn-group" style="float: left">
        <button type="button" class="btn btn-info">Standard</button>&nbsp
        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
          <span class="caret"></span>
          <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu" role="menu">
          <li><a href="#">1</a></li>
          <li><a href="#">2</a></li>
          <li><a href="#">3</a></li>
          <li><a href="#">4</a></li>
        </ul>
      </div>
    </div>
    <div class="col-md-4">
      <div class="btn-group" style="float: left">
        <button type="button" class="btn btn-info">Division</button>&nbsp
        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
          <span class="caret"></span>
          <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu" role="menu">
          <li><a href="#">A</a></li>
          <li><a href="#">B</a></li>
        </ul>
      </div>

    </div>
    <div class="col-md-4">
      <div class="btn-group" style="float: left">
        <button type="button" class="btn btn-info">Subject</button>&nbsp
        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
          <span class="caret"></span>
          <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu" role="menu">
          <li><a href="#">Kannada</a></li>
          <li><a href="#">Hindi</a></li>
          <li><a href="#">English</a></li>
          <li><a href="#">Mathematics</a></li>
          <li><a href="#">Science</a></li>
          <li><a href="#">Social Studies</a></li>
        </ul>
      </div>

    </div>
  </div>
  <div style="margin:10px 0px">
    <table class="table table-striped ">
      <thead>
        <tr>
          <th>Student Name</th>
          <th>Attendence</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td>Vinay</td>
          <td><input type="checkbox"></td>
        </tr>
        <tr>
          <td>Prashant</td>
          <td><input type="checkbox"></td>
        </tr>
        <tr>
          <td>Sanjeev</td>
          <td><input type="checkbox"></td>
        </tr>
        <tr>
          <td>Avadhut</td>
          <td><input type="checkbox"></td>
        </tr>
        <tr>
          <td>Deepak</td>
          <td><input type="checkbox"></td>
        </tr>
      </tbody>
    </table>
  </div>
  </div> 
</div>

<!-- End Attendance -->

<!-- Complaints -->

<div role="tabpanel" class="tab-pane" id="complaints">
  <div class="container" style="padding:0% 6%">
  
  <h1 style="color:lightblue">Complaints</h1>
  <i>Complaints of students.</i>
  <hr width=100%  align=left>
  
  <div class="btn-group" style="float: left">
        <button type="button" class="btn btn-info">Standard</button>&nbsp
        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
          <span class="caret"></span>
          <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu" role="menu" id="complaints_standard"></ul>
  </div>

  <div class="btn-group" style="float: left">
        <button type="button" class="btn btn-info">Division</button>&nbsp
        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
          <span class="caret"></span>
          <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu" role="menu" id="complaints_division"></ul>
      </div>

  <div class="btn-group" style="float: left">
        <button type="button" class="btn btn-info">Student Name</button>
        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
          <span class="caret"></span>
          <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu" role="menu" id="complaints_student"></ul>
  </div>
  <br/>
  <h3>Complaint :</h3><textarea class="form-control" rows="3" id="complaintText"></textarea><br/>
  <button type="button" class="btn btn-primary btn-lg" onclick="submitComplaint()">Submit</button>
  <br/>
  <br/>
  <div>
    <h1 style="color:lightpink">Complaints</h1>
    <hr width=100%  align=left>
    <div class="table-responsive">
    <table class="table table-striped" id="tbl-student-complaints">
      <thead>
        <tr>
          <th><center>#</center></th>
          <th><center>Complaint</center></th>
          <th><center>Send Message or E-mail</center></th>
          <th><center>Date & Time</center></th>
        </tr>
      </thead>
      <tbody>
      </tbody>
    </table>
    <br/>
  </div>
  </div>
  </div> 
</div>

<!-- End Complaints -->

<!-- Remarks -->

<div role="tabpanel" class="tab-pane" id="remarks">
  <div class="container" style="padding:0% 6%">
  
  <h1 style="color:lightblue">Remarks</h1>
  <i>Students remarks given by their teachers.</i>
  <hr width=100%  align=left>
  
  <div class="btn-group" style="float: left">
        <button type="button" class="btn btn-info">Standard</button>&nbsp
        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
          <span class="caret"></span>
          <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu" role="menu" id="remarks_standard"></ul>
  </div>

  <div class="btn-group" style="float: left">
        <button type="button" class="btn btn-info">Division</button>&nbsp
        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
          <span class="caret"></span>
          <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu" role="menu" id="remarks_division"></ul>
  </div>

  <div class="btn-group" style="float: left">
        <button type="button" class="btn btn-info">Student Name</button>
        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
          <span class="caret"></span>
          <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu" role="menu" id="remarks_student"></ul>
  </div>
  <br/>

  <h3>Remarks :</h3><textarea class="form-control" rows="3" id="remarkText"></textarea><br/>
  <button type="button" class="btn btn-primary btn-lg" onclick="submitRemark()">Submit</button>
  <br/>
  <br/>

  <div>
    <h1 style="color:lightpink">Remarks</h1>
    <hr width=100%  align=left>
    <div class="table-responsive">
    <table class="table table-striped" id="tbl-student-remarks">
      <thead>
        <tr>
          <th><center>#</center></th>
          <th><center>Remark</center></th>
          <th><center>Send Message or E-mail</center></th>
          <th><center>Date & Time</center></th>
        </tr>
      </thead>
      <tbody>
      </tbody>
    </table>
    <br/>
    </div>
  </div>

  </div> 
</div>

<!-- End Remarks -->

<!-- Results -->

<div role="tabpanel" class="tab-pane" id="results">
  <div class="container" style="padding:0% 6%">

  <h1 style="color:lightblue">Results</h1>
  <i>Test & annual results.</i>
  <hr width=100%  align=left>
  
  <br/>

  <div style="padding:10px;">
    <div role="tabpanel">
      <ul class="nav nav-tabs" role="tablist">
          <li role="presentation" class="active"><a href="#unit_test" aria-controls="home" role="tab" data-toggle="tab">Unit Test</a></li>
          <li role="presentation"><a href="#mid_term_exam" aria-controls="profile" role="tab" data-toggle="tab">Mid-term exam</a></li>
          <li role="presentation"><a href="#anual_exam" aria-controls="messages" role="tab" data-toggle="tab">Annual exam</a></li>
        </ul>
        <div class="tab-content">
          <div role="tabpanel" class="tab-pane fade in active" id="unit_test">
            <div class="row" style="padding: 40px 10px">
              <div class="col-md-3">
                <div class="btn-group" style="float: left">
                  <button type="button" class="btn btn-info">Standard</button>
                  <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                    <span class="caret"></span>
                    <span class="sr-only">Toggle Dropdown</span>
                  </button>
                  <ul class="dropdown-menu" role="menu">
                    <li><a href="#">1</a></li>
                    <li><a href="#">2</a></li>
                    <li><a href="#">3</a></li>
                    <li><a href="#">4</a></li>
                  </ul>
                </div>
              </div>
              <div class="col-md-3">
                <div class="btn-group" style="float: left">
                  <button type="button" class="btn btn-info">Division</button>
                  <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                    <span class="caret"></span>
                    <span class="sr-only">Toggle Dropdown</span>
                  </button>
                  <ul class="dropdown-menu" role="menu">
                    <li><a href="#">A</a></li>
                    <li><a href="#">B</a></li>
                  </ul>
                </div>
              </div>
              <div class="col-md-3">
                <div class="btn-group" style="float: left">
                  <button type="button" class="btn btn-info">Test</button>
                  <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                    <span class="caret"></span>
                    <span class="sr-only">Toggle Dropdown</span>
                  </button>
                  <ul class="dropdown-menu" role="menu">
                    <li><a href="#">1</a></li>
                    <li><a href="#">2</a></li>
                    <li><a href="#">3</a></li>
                    <li><a href="#">4</a></li>
                  </ul>
                </div>
              </div>
            </div>


            <div>
              <table class="table table-bordered" id="tbl-unit-test-results">
                <thead>
                  <tr>
                    <th>Student/Subject</th>
                    <th>Kannada</th>
                    <th>Hindi</th>
                    <th>English</th>
                    <th>Mathematics</th>
                    <th>Scince</th>
                    <th>Social Science</th>
                    <th>Action</th>
                  </tr>
                </thead>
                <tbody>
                  <tr>
                    <th>Vinay Uppin</th>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><buttom class="btn btn-xs btn-primary">Save</button></td>
                  </tr>
                  <tr>
                    <th>Avadhat Joshi</th>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><buttom class="btn btn-xs btn-primary">Save</button></td>
                  </tr>
                  <tr>
                    <th>Prashant Ladwa</th>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><buttom class="btn btn-xs btn-primary">Save</button></td>
                  </tr>
                  <tr>
                    <th>Nikhil Rane</th>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><buttom class="btn btn-xs btn-primary">Save</button></td>
                  </tr>
                </tbody>
              </table>
            </div>

          </div>
          <div role="tabpanel" class="tab-pane fade" id="mid_term_exam">
            <div class="row" style="padding: 40px 10px">
              <div class="col-md-3">
                <div class="btn-group" style="float: left">
                  <button type="button" class="btn btn-info">Standard</button>
                  <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                    <span class="caret"></span>
                    <span class="sr-only">Toggle Dropdown</span>
                  </button>
                  <ul class="dropdown-menu" role="menu">
                    <li><a href="#">1</a></li>
                    <li><a href="#">2</a></li>
                    <li><a href="#">3</a></li>
                    <li><a href="#">4</a></li>
                  </ul>
                </div>
              </div>
              <div class="col-md-3">
                <div class="btn-group" style="float: left">
                  <button type="button" class="btn btn-info">Division</button>
                  <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                    <span class="caret"></span>
                    <span class="sr-only">Toggle Dropdown</span>
                  </button>
                  <ul class="dropdown-menu" role="menu">
                    <li><a href="#">A</a></li>
                    <li><a href="#">B</a></li>
                  </ul>
                </div>
              </div>
            </div>


            <div>
              <table class="table table-bordered" id="tbl-mid-term-results">
                <thead>
                  <tr>
                    <th>Student/Subject</th>
                    <th>Kannada</th>
                    <th>Hindi</th>
                    <th>English</th>
                    <th>Mathematics</th>
                    <th>Scince</th>
                    <th>Social Science</th>
                    <th>Action</th>
                  </tr>
                </thead>
                <tbody>
                  <tr>
                    <th>Vinay Uppin</th>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><buttom class="btn btn-xs btn-primary">Save</button></td>
                  </tr>
                  <tr>
                    <th>Avadhat Joshi</th>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><buttom class="btn btn-xs btn-primary">Save</button></td>
                  </tr>
                  <tr>
                    <th>Prashant Ladwa</th>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><buttom class="btn btn-xs btn-primary">Save</button></td>
                  </tr>
                  <tr>
                    <th>Nikhil Rane</th>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><buttom class="btn btn-xs btn-primary">Save</button></td>
                  </tr>
                </tbody>
              </table>
            </div>
          </div>
          <div role="tabpanel" class="tab-pane fade" id="anual_exam">
            <div class="row" style="padding: 40px 10px">
              <div class="col-md-3">
                <div class="btn-group" style="float: left">
                  <button type="button" class="btn btn-info">Standard</button>
                  <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                    <span class="caret"></span>
                    <span class="sr-only">Toggle Dropdown</span>
                  </button>
                  <ul class="dropdown-menu" role="menu">
                    <li><a href="#">1</a></li>
                    <li><a href="#">2</a></li>
                    <li><a href="#">3</a></li>
                    <li><a href="#">4</a></li>
                  </ul>
                </div>
              </div>
              <div class="col-md-3">
                <div class="btn-group" style="float: left">
                  <button type="button" class="btn btn-info">Division</button>
                  <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                    <span class="caret"></span>
                    <span class="sr-only">Toggle Dropdown</span>
                  </button>
                  <ul class="dropdown-menu" role="menu">
                    <li><a href="#">A</a></li>
                    <li><a href="#">B</a></li>
                  </ul>
                </div>
              </div>
            </div>


            <div>
              <table class="table table-bordered" id="tbl-annual-exam-results">
                <thead>
                  <tr>
                    <th>Student/Subject</th>
                    <th>Kannada</th>
                    <th>Hindi</th>
                    <th>English</th>
                    <th>Mathematics</th>
                    <th>Scince</th>
                    <th>Social Science</th>
                    <th>Action</th>
                  </tr>
                </thead>
                <tbody>
                  <tr>
                    <th>Vinay Uppin</th>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><buttom class="btn btn-xs btn-primary">Save</button></td>
                  </tr>
                  <tr>
                    <th>Avadhat Joshi</th>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><buttom class="btn btn-xs btn-primary">Save</button></td>
                  </tr>
                  <tr>
                    <th>Prashant Ladwa</th>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><buttom class="btn btn-xs btn-primary">Save</button></td>
                  </tr>
                  <tr>
                    <th>Nikhil Rane</th>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><input type="text" class="form-control" style="max-width: 70px;"></td>
                    <td><buttom class="btn btn-xs btn-primary">Save</button></td>
                  </tr>
                </tbody>
              </table>
            </div>
          </div>
        </div>
      </div>
  </div>

  </div> 
</div>

<!-- End Results -->

<!-- Discipline -->

<div role="tabpanel" class="tab-pane" id="discipline">
  <div class="container" style="padding:0% 6%">
  
  <h1 style="color:lightblue">Discipline</h1>
  <i>Teachers review on students discipline.</i>
  <hr width=100%  align=left>
  
  <div class="btn-group" style="float: left">
        <button type="button" class="btn btn-info">Standard</button>&nbsp
        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
          <span class="caret"></span>
          <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu" role="menu" id="discipline_standard"></ul>
  </div>

  <div class="btn-group" style="float: left">
        <button type="button" class="btn btn-info">Division</button>&nbsp
        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
          <span class="caret"></span>
          <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu" role="menu" id="discipline_division"></ul>
      </div>

  <div class="btn-group" style="float: left">
        <button type="button" class="btn btn-info">Student Name</button>
        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
          <span class="caret"></span>
          <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu" role="menu" id="discipline_student"></ul>
  </div>
  <br/>

  <h3>Discipline Report :</h3><textarea class="form-control" rows="3" id="disciplineText"></textarea><br/>
  <button type="button" class="btn btn-primary btn-lg" onclick="submitDiscipline()">Submit</button>
  <br/>
  <br/>

  <div>
    <h1 style="color:lightpink">Discipline</h1>
    <hr width=100%  align=left>
    <div class="table-responsive">
    <table class="table table-striped" id="tbl-decipline-student">
      <thead>
        <tr>
          <th><center>#</center></th>
          <th><center>Discipline</center></th>
          <th><center>Send Message or E-mail</center></th>
          <th><center>Date & Time</center></th>
        </tr>
      </thead>
      <tbody>
      </tbody>
    </table>
    <br/>
  </div>
  </div>
  </div> 
</div>

<!-- End Discipline -->

<!-- Achievements -->

<div role="tabpanel" class="tab-pane" id="achievements">
  <div class="container" style="padding:0% 6%">
 
  <h1 style="color:lightblue">Achievements</h1>
  <i>Students achievements in class & school.</i>
  <hr width=100%  align=left>
  
  <div class="btn-group" style="float: left">
        <button type="button" class="btn btn-info">Standard</button>&nbsp
        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
          <span class="caret"></span>
          <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu" role="menu" id="achievements_standard"></ul>
  </div>

  <div class="btn-group" style="float: left">
        <button type="button" class="btn btn-info">Division</button>&nbsp
        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
          <span class="caret"></span>
          <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu" role="menu" id="achievements_division"></ul>
      </div>

  <div class="btn-group" style="float: left">
        <button type="button" class="btn btn-info">Student Name</button>
        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
          <span class="caret"></span>
          <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu" role="menu" id="achievements_student"></ul>
  </div>
  <br/>

  <h3>Achievement :</h3><textarea class="form-control" rows="3" id="achievementText"></textarea><br/>
  <button type="button" class="btn btn-primary btn-lg" onclick="submitAchievement()">Submit</button>
  <br/>
  <br/>

  <div>
    <h1 style="color:lightpink">Achievements</h1>
    <hr width=100%  align=left>
    <div class="table-responsive">
    <table class="table table-striped" id="tbl-student-achievements">
      <thead>
        <tr>
          <th><center>#</center></th>
          <th><center>Remark</center></th>
          <th><center>Send Message or E-mail</center></th>
          <th><center>Date & Time</center></th>
        </tr>
      </thead>
      <tbody>
      </tbody>
    </table>
    <br/>
  </div>
  </div>
  </div> 
</div>

<!-- End Achievements -->

<!-- Rankings -->

<div role="tabpanel" class="tab-pane" id="rankings">
  <div class="container" style="padding:0% 6%">
  
  <h1 style="color:lightblue">Rankings</h1>
  <i>Displays top scorer in standard, division & individual subject</i>
  <hr width=100%  align=left>

  <div class="btn-group" style="float: left">
        <button type="button" class="btn btn-info">Standard</button>&nbsp
        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
          <span class="caret"></span>
          <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu" role="menu">
          <li><a href="#">1</a></li>
          <li><a href="#">2</a></li>
          <li><a href="#">3</a></li>
          <li><a href="#">4</a></li>
        </ul>
  </div>

  <div class="btn-group" style="float: left">
        <button type="button" class="btn btn-info">Division</button>&nbsp
        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
          <span class="caret"></span>
          <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu" role="menu">
          <li><a href="#">1</a></li>
          <li><a href="#">2</a></li>
          <li><a href="#">3</a></li>
          <li><a href="#">4</a></li>
        </ul>
  </div>
  <br/>

  <br/>
  <br/>
  <br/>
  <br/>
  

  </div> 
</div>

<!-- End Rankings -->

<!-- Parent Portal -->

<div role="tabpanel" class="tab-pane" id="parentportal">
  <img width="280px" height="300px"src="images/sidetp.png" style="margin-top:-100px;">
  <div class="container" style="padding:0% 6%">
  
  </div> 
</div>

<!-- End Parent Portal -->

<!-- Parent Messaging -->

<div role="tabpanel" class="tab-pane" id="parentmsg">
  <img width="280px" height="300px"src="images/sidetp.png" style="margin-top:-100px;">
  <div class="container" style="padding:0% 6%">
  
  </div> 
</div>

<!-- End Parent Messaging -->

<!-- Extra Curricular -->

<div role="tabpanel" class="tab-pane" id="extracurricular">
  <div class="container" style="padding:0% 6%">

  <h1 style="color:lightblue">Extra Curricular</h1>
  <i>Extra curricular activities.</i>
  <hr width=100%  align=left>
  
  <div class="btn-group" style="float: left">
        <button type="button" class="btn btn-info">Standard</button>&nbsp
        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
          <span class="caret"></span>
          <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu" role="menu" id="extra_standard"></ul>
  </div>

  <div class="btn-group" style="float: left">
        <button type="button" class="btn btn-info">Division</button>&nbsp
        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
          <span class="caret"></span>
          <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu" role="menu" id="extra_division"></ul>
      </div>

  <div class="btn-group" style="float: left">
        <button type="button" class="btn btn-info">Student Name</button>
        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
          <span class="caret"></span>
          <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu" role="menu" id="extra_student"></ul>
  </div>
  <br/>

  <h3>Extra Curricular Activity :</h3><textarea class="form-control" rows="3" id="extraText"></textarea><br/>
  <button type="button" class="btn btn-primary btn-lg" onclick="submitExtra()">Submit</button>
  <br/>
  <br/>

  <div>
    <h1 style="color:lightpink">Extra Curricular</h1>
    <hr width=100%  align=left>
    <div class="table-responsive">
    <table class="table table-striped" id="tbl-student-extra">
      <thead>
        <tr>
          <th><center>#</center></th>
          <th><center>Remark</center></th>
          <th><center>Send Message or E-mail</center></th>
          <th><center>Date & Time</center></th>
        </tr>
      </thead>
      <tbody>
      </tbody>
    </table>
    <br/>
  </div>
  </div>  
  </div> 
</div>

<!-- End Extra Curricular -->


</div><!-- End of tab content -->

<!-- =================================  End of Tab Content  ==================================== -->

<!-- ============================   Upper Footer   ========================= -->

<div class="row-fluid" style="padding:0% 10%; background: #eeeee0">
  <div class="container" style="margin-left:-4%">
    <div class="row">
      <br>
      <div class="col-xs-6 col-sm-3" style="text-align:center;">
        <font size="2" face="Arial" color="black"><b>ABOUT LIFEINCLASS</b></font>
        <ul style="list-style: none; color:CadetBlue; margin-right:40px;">
          <li>A Word From Us</a><li>   
          <li>Contact Us<li>
        </ul>
      </div>

      <div class="col-xs-6 col-sm-3" style="text-align:center;">
        <font size="2" face="Arial" color="black"><b>FEATURES</b></font>
        <ul style="list-style: none; color:CadetBlue; margin-right:40px;">
          <li>Attendance<li>   
          <li>Student Information<li>
          <li>Teacher Information<li>
          <li>Parent Access<li>
          <li>Email & Text Messaging <li>
          <li>Upcoming Events Etc<li>
        </ul>
      </div>
   

  <!-- Add the extra clearfix for only the required viewport -->
      <div class="clearfix visible-xs-block"></div>

      <div class="col-xs-6 col-sm-3" style="text-align:center;">
        <font size="2" face="Arial" color="black"><b>WHY LIFEINCLASS?</b></font>
        <ul style="list-style: none; color:CadetBlue; margin-right:40px;">
          <li>Simple<li>   
          <li>Powerfull<li>
          <li>Integrated<li>
          <li>Affordable<li>
          <li>Fully Online<li>
        </ul>
      </div>

      <div class="col-xs-6 col-sm-3" style="text-align:center;">
        <font size="2" face="Arial" color="black"><b>CONNECT WITH US</b></font>
        <ul style="list-style: none; color:CadetBlue; margin-right:40px;">
          <li>Facebook<li>
          <li>Twitter<li>
          <li>Google Plus<li>   
        </ul>
      </div>

    </div>
    <br>
  </div>
</div>

<!-- ========================   End Of Upper Footer   ====================== -->



 <!-- ============================   Footer  =========================== -->

    
  <div class="footer" style="background-color: #a8cf45; padding:0% 12%;">
    <div class="container">
      <div class="navbar-header">
        <a href="index.html"><img width="250px" src="images/logo1.png" style="margin-top:30px"></a>
        <font size="1"><P>Copyright 2014-15. All rights reserved</P></font>
      </div>
      <div id="navbar" style="margin-top:40px;">
        <ul class="navbar-nav pull-right" style="margin-right:20%; margin-bottom:2%; list-style:none;">
          <li><a href="privacy.html">Privacy Policy</a>&nbsp&nbsp&nbsp</li>
          <li><a href="terms.html">Terms and Conditions</a>&nbsp&nbsp&nbsp</li>
        </ul>
      </div>
    </div>
  </div>

<!-- ============================   END of Footer  =========================== -->


    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
	<script src="js/jquery.cookie.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/index.js"></script>
    <script src="js/ie-emulation-modes-warning.js"></script>
    <script src="js/bootstrap.js"></script>
    <script type="text/javascript" language="javascript" src="js/jquery.dataTables.js"></script>
    <script type="text/javascript" src="js/schoolcontrolpanel.js"></script>
        
    <script type="text/javascript" src="js/schoolcontrolpanel/complaints.js"></script>
    <script type="text/javascript" src="js/schoolcontrolpanel/remarks.js"></script>
    <script type="text/javascript" src="js/schoolcontrolpanel/discipline.js"></script>
    <script type="text/javascript" src="js/schoolcontrolpanel/achievements.js"></script>
    <script type="text/javascript" src="js/schoolcontrolpanel/extra.js"></script>
    <script type="text/javascript" src="js/schoolcontrolpanel/student.js"></script>
    <script type="text/javascript" src="js/schoolcontrolpanel/teacher.js"></script>
    
    <script type="text/javascript" src="js/schoolcontrolpanel/examConf.js"></script>
    
    <script>
     $('.dropdown-toggle').dropdown()
    </script>
  </body>
</html> 
